{include file="public/header" /}
    <style>
        .minHeightbg {
            min-height: 100%;
            background: url("/static/home/a036_39.png") no-repeat center;
            background-size: cover;
        }
        body {
            background: none;
        }
        .inputthbimg {
            height:55px;
            overflow: hidden;
            text-align:center;
            margin:60px 0px 0px 0px;
        }
        .inputthbimg img {
            height:100%;
        }
        .touminhezi {
            width: 85%;
            margin:0 auto;
            margin-top:4em;
        }
        .inputthbox {
            height:44px;
            border-radius: 3px;
            background-color: hsla(0,0%,100%,.2);
            margin-bottom:15px;
            position: relative;
        }
        .inputthbox .imgic {
            height:20px;
            width:20px;
            position: absolute;
            left:15px;
            top:10px;
        }
        .inputthbox input {
            background:none;
            border:none;
            height:42px;
            line-height: 42px;
            padding-left:55px;
            color:#cccccc;
            font-size:14px;
        }
        .inputthbox input::-webkit-input-placeholder {color:#aaaaaa;}
        .inputthbox input:-moz-placeholder {color:#aaaaaa;}
        .inputthbox input::-moz-placeholder {color:#aaaaaa;}
        .inputthbox input:-ms-input-placeholder {color:#aaaaaa;}
        .inputthbox .yanzhmimg {
            position: absolute;
            top:4px;
            right:4px;
            border-radius: 3px;
            height:28px;
        }
        .linkchuqu {
            margin-top:10px;
            line-height: 30px;
            text-align: center;
        }
        .operatingAN {
            display: inline-block;
            width: 100%;
            text-align: center;
            height: 50px;
            line-height:50px;
            padding: 0px;
            background:#CFB283;
            color: #fff;
            border: none;
            letter-spacing: 2px;
            font-size:16px;
            font-family:"仿宋";
            margin-top:1.8em;
        }
        .linkchuqu .linkA {color:#cfb283;font-size:0.9em;}
        .yanzhmimg button {
            color:#40A5F0;
            border:none;
            height:100%;
            background: none;
            padding:0px;
        }
        .setPasswordForm {
            display: none;
        }
    </style>
<link id="layuicss-layer" rel="stylesheet" href="/static/home/layer.css" media="all">
</head>

<body class="mui-ios mui-ios-10 mui-ios-10-3 mui-ios-10-3-1" style="">
<header id="header" class="mui-bar mui-bar-nav">
    <h1 class="mui-title">AMBL</h1>
    <div class="mui-pull-right" style="display: none;">
        <div class="mui-switch mui-active" data-switch="2">
            <div class="mui-switch-handle"></div>
        </div>
    </div>
</header>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
    <div class="mui-scroll" style="transform: translate3d(0px, 0px, 0px) translateZ(0px);">
        <div class="inputthbimg">
            <a href="{:url('login/dologin')}"><img src="/static/home/5bd971da415cf.png" alt=""></a>
        </div>
        <div id="item2" class="touminhezi">
            <form id="forgotByMobileForm" class="setPassworaxybForm">
                <div class="inputthbox">
                    <img src="/static/home/a036_41.png" alt="" class="imgic">
                    <input type="text" name="account" autocomplete="off" class="mui-input-clear username" placeholder="{:lang('请输入账号')}">
                </div>
                <div class="inputthbox" style="display: none;">
                    <img src="/static/home/a036_42.png" alt="" class="imgic">
                    <div class="userRegisGuo"><span class="valSwitch">请选择密保问题</span></div>
                </div>
                <div class="inputthbox" style="display: none;">
                    <img src="/static/home/a036_43.png" alt="" class="imgic">
                    <input type="text" name="answer" autocomplete="off" class="mui-input-clear" placeholder="请回答密保问题">
                </div>

                <div class="inputthbox">
                    <img src="/static/home/a036_42.png" alt="" class="imgic">
                    <input type="password" name="newPass" autocomplete="off" class="mui-input-clear" placeholder="{:lang('新密码')}">
                </div>

                <div class="inputthbox">
                    <img src="/static/home/a036_42.png" alt="" class="imgic">
                    <input type="password" name="confirmPass" autocomplete="off" class="mui-input-clear" placeholder="{:lang('请再次输入您的新密码')}">
                </div>

                <div class="inputthbox">
                    <img src="/static/home/a036_43.png" alt="" class="imgic">
                    <input type="text" name="code" style="width: 200px;" autocomplete="off" class="gisteinput" placeholder="{:lang('请输入验证码')}">
                    <button class="mui-btn sms" type="button" style="height: 42px;" >{:lang('获取验证码')}</button>
                </div>

                <input type="hidden" name="security_id" autocomplete="off" value="">
                <button type="button" class="mui-btn mui-btn-primary operatingAN setPassworaxyb forgotByMobile subVerifyAccount">找回</button>
                {:token('__token__', 'sha1')}
            </form>

        </div>
    </div>
<div class="mui-scrollbar mui-scrollbar-vertical"><div class="mui-scrollbar-indicator" style="transition-duration: 0ms; display: none; height: 520px; transform: translate3d(0px, 0px, 0px) translateZ(0px);"></div></div></div>
<!--国家代码   s-->
<div class="countryCodeBox" style="display: none;">
    <div class="countryCodegb"></div>
    <div class="countryCodehi">
        <div class="countryCodeheder">密保问题</div>
        <div class="countryCodeText">
            <ul class="mui-table-view mui-table-view-radio country_select">
                <li class="mui-table-view-cell clickonse" data-id="1">
                        <a class="mui-navigate-right"><span class="countrydm">我的姓名叫什么？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="2">
                        <a class="mui-navigate-right"><span class="countrydm">我的电话号码是多少？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="3">
                        <a class="mui-navigate-right"><span class="countrydm">你是谁？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="4">
                        <a class="mui-navigate-right"><span class="countrydm">我最喜欢什么？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="5">
                        <a class="mui-navigate-right"><span class="countrydm">我的生日是？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="6">
                        <a class="mui-navigate-right"><span class="countrydm">我最喜欢的人是？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="7">
                        <a class="mui-navigate-right"><span class="countrydm">我的宠物名字是？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="8">
                        <a class="mui-navigate-right"><span class="countrydm">我的爱人名字是？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="9">
                        <a class="mui-navigate-right"><span class="countrydm">我爱人的生日是？</span></a>
                    </li><li class="mui-table-view-cell clickonse" data-id="10">
                        <a class="mui-navigate-right"><span class="countrydm">我的小学学校是？</span></a>
                    </li>                <!--<li class="mui-table-view-cell clickonse">
                    <a class="mui-navigate-right"><span class="countrydm">我的生日？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse">
                    <a class="mui-navigate-right"><span class="countrydm">我最喜欢的人？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse">
                    <a class="mui-navigate-right"><span class="countrydm">我曾所读的小学校名？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse-selected">
                    <a class="mui-navigate-right"><span class="countrydm">我的宠物的名字？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse">
                    <a class="mui-navigate-right"><span class="countrydm">我的生日？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse">
                    <a class="mui-navigate-right"><span class="countrydm">我最喜欢的人？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse">
                    <a class="mui-navigate-right"><span class="countrydm">我曾所读的小学校名？</span></a>
                </li>
                <li class="mui-table-view-cell clickonse-selected">
                    <a class="mui-navigate-right"><span class="countrydm">我的宠物的名字？</span></a>
                </li>-->
            </ul>
        </div>
        <div class="countryCodeFooter df">
            <div class="fx1 quxiaogb">取消</div>
            <div class="fx1 queren">确认</div>
        </div>
    </div>
</div>
<!--国家代码   e-->

{include file="public/footer" /}
<script>
    var mask=mui.createMask();
    layui.use('upload', function(){
        var upload = layui.upload;
        upload.render({
            elem: '.uploadImg',
            url:'/Zfuwl/Api/imageUp.html',
            choose:function(){
                mui.showLoading("提交中","div");
                mask.show();//显示遮罩层
            },
            before: function(obj){
                mui.showLoading("上传中","div");
                obj.preview(function(index, file, result){
                    $('.uploadImgHead').find('img').attr('src', result);
                });
            }
            ,done: function(res, index, upload){
                $.post("/User/saveUserHeadImg.html",{src:res.data.src}, function(data){
                    mask.close();//关闭遮罩层
                    mui.hideLoading();
                    if(data.status == 1) {
                        mui.toast('上传成功',{ duration:'2000', type:'div' });
                    } else {
                        mui.toast(data.msg,{ duration:'2000', type:'div' });
                    }
                });
            },error:function(){
                mask.close();//关闭遮罩层
                mui.hideLoading();
                mui.toast('上传失败',{ duration:'2000', type:'div' });
            }
        });
    });
    mui('body').on('tap', '.uploadImgHead', function(){
        $('.uploadImg').click();
    });

    mui('body').on('tap', ".logout", function () {
        var btnArray = ['确认', '取消'];
        mui.confirm('是否确认退出？', '温馨提示', btnArray, function (e) {
            if (e.index == 0) {
                mui.openWindow({
                    id: 'logout',
                    url: "/User/logout.html"
                });
            }
        });
    });
    $(".sms").click(function(){
        let phone = $(".username").val();
        $.post("{:url('login/sendSms')}",{action:'forgotindex',phone:phone},function(data){
            mui.toast(data.msg, {
                duration: '2000',
                type: 'div'
            });
        });
    });
</script>
<script src="/static/home/zfuwl.js"></script>
<script type="text/javascript">
    mui('.mui-scroll-wrapper').scroll({
        deceleration: 0.0005
    });

    //   设置密码区  s
    /*mui("body").on('tap', '.setPassworaxyb', function () {
        $('.setPassworaxybForm').css('display','none');
        $('.setPasswordForm').css('display','block');
    });*/


    //   设置密码区  e




    //        国家代码 s
    mui("body").on('tap', '.userRegisGuo', function () {
        $(".countryCodeBox").show();
    });
    mui("body").on('tap', '.quxiaogb', function () {
        $(".countryCodeBox").hide();
    });
    mui("body").on('tap', '.countryCodegb', function () {
        $(".countryCodeBox").hide();
    });

    var selectedValue = $('.country_select').find('.mui-selected').find('.countrydm').html(),security_id = $('.country_select').find('.mui-selected').data('id');
    mui("body").on('tap', '.clickonse', function () {
        selectedValue = $(this).find('.countrydm').html();
        security_id = $(this).data('id');
        $(this).addClass('mui-selected').siblings('li').removeClass('mui-selected');
    });
    mui("body").on('tap', '.queren', countryConfirm);
    function countryConfirm()
    {
        $('.valSwitch').html(selectedValue);
        $(".countryCodeBox").hide();
        $('input[name="security_id"]').val(security_id);
    }
    countryConfirm();
    //        国家代码 e

    var mask=mui.createMask();
    mui('body').on('tap', '.subVerifyAccount', function () {
        var obj = $(this);
        $(obj).attr('disabled', 'true');
        mui.showLoading("提交中","div");
        mask.show();//显示遮罩层
        $.ajax({
            type: 'post',
            url: '{:url('forgotindex')}' ,
            data: $('#forgotByMobileForm').serialize(),
            dataType: 'json',
            success: function (res) {
                mask.close();//关闭遮罩层
                mui.hideLoading();
                if (res.status == 1) {
                    mui.toast('找回密码成功', {duration: '2000', type: 'div'});
                    setTimeout(function () {
                        mui.openWindow({
                            id: res.url,
                            url: res.url
                        });
                    }, 2000);
                } else {
                    refreshVerify();
                    $(obj).removeAttr('disabled');
                    return mui.toast(res.msg, {duration: '2000', type: 'div'});
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                return mui.toast('网络失败，请刷新页面后重试', {duration: '2000', type: 'div'});
            }
        });
    });
    mui('body').on('tap', '.setPassword', function () {
        var obj = $(this);
        $(obj).attr('disabled', 'true');
        mui.showLoading("提交中","div");
        mask.show();//显示遮罩层
        $.ajax({
            type: 'post',
            url: '{:url('forgotindex')}',
            data: $('#setPasswordForm').serialize(),
            dataType: 'json',
            success: function (res) {
                mask.close();//关闭遮罩层
                mui.hideLoading();
                if (res.status == 1) {
                    mui.toast(res.msg, {duration: '2000', type: 'div'});
                    history.go(-1);
                } else {
                    refreshVerify();
                    $(obj).removeAttr('disabled');
                    return mui.toast(res.msg, {duration: '2000', type: 'div'});
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                return mui.toast('网络失败，请刷新页面后重试', {duration: '2000', type: 'div'});
            }
        });
    });
    function refreshVerify() {
        $('.imgYzm').attr('src', '/Login/verify/type/forgotPass.html&a=' + Math.random());
    }

    var smsObj = [];
    // 发送手机短信
    function send_sms_reg_code(obj) {
        smsObj = obj;
        var mobile = $('#mobile').val();
        if (!checkMobile(mobile)) {
            mui.toast('请输入正确的手机号码', {
                duration: 'long',
                type: 'div'
            });
            return;
        }         var data = {
            mobile: mobile
        };        var url = "/Reg/sendSmsRegCode.html";
        mui.showLoading("正在发送", "div");
        mask.show(); //显示遮罩层
        $.post(url, data, function(data) {
            mask.close(); //关闭遮罩层
            mui.hideLoading();
            obj = $.parseJSON(data);
            if (obj.status == 1) {
                $(smsObj).attr("disabled", "disabled");
                intAs = 600; // 手机短信超时时间
                jsInnerTimeout(intAs);
                mui.toast(obj.msg, {
                    duration: 'long',
                    type: 'div'
                });
            } else {
                mui.toast(obj.msg, {
                    duration: 'long',
                    type: 'div'
                });
            }
        });
    }
    mui('body').on('tap','.imgYzm', refreshVerify);
    //倒计时函数
    function jsInnerTimeout(intAs) {
        intAs--;
        if (intAs <= -1) {
            $(smsObj).removeAttr("disabled");
            $(smsObj).text("获取验证码");
            return true;
        }
        $(smsObj).text(intAs + '秒');
        setTimeout("jsInnerTimeout(" + intAs + ")", 1000);
    };
</script>


</body></html>